<template>
	<view class="bigbox">
		<!-- 上面的盒子 -->
		<view class="box-top flex boxr pl40 pt60 pb60 mt26">
			<!-- 左侧的盒子 -->
			<view class="box-top-l">
				<image src="/static/img/index/13招考-完成.png" class="w82 h82 mr40"></image>
			</view>
			<!-- 右侧的盒子 -->
			<view class="box-top-r flex row-column row-between">
				<view class="box-top-r-tit">
					已完成
				</view>
				<view class="box-top-r-time">
					<text>下单时间:</text>
					<text>2021-12-21 12:20:31</text>
				</view>
			</view>
		</view>
		<!-- /上面的盒子 -->
		
		<!-- 中间的盒子 -->
		<view class="box-item flex pl30	pt30 pb34 mt28">
			<!-- 左侧 -->
			<image src="/static/img/index/3liepin-zhaopinpng" class="w180 h180"></image>
			<!-- 右侧 -->
			<view class="box-item-r flex row-column row-between ml30">
				<view class="box-item-r-tit">
					2022年国考一对一辅导
				</view>
				<view class="h40 box-item-r-type">
					国考
				</view>
				<view class="">
					<text class="box-item-r-pay">支付金额:</text>
					<text class="box-item-r-pic">￥699</text>
				</view>
			</view>
		</view>
		<!-- /中间的盒子 -->
		
		<!-- 下面的盒子 -->
		<view class="boxr pt40 pb48 pl20 mt26">
			<view class="paytime mb44">
				<text>支付时间：</text>
				<text>2021-12-13 18:36:53</text>
			</view>
			<view class="pay-status">
				<text>状态：</text>
				<text>已完成</text>
			</view>
		</view>
		<!-- /下面的盒子 -->
	</view>
</template>

<script>
	export default {
		data() {
			return {
				
			};
		}
	}
</script>

<style lang="scss">
.box-top {
	.box-top-r {
		.box-top-r-tit {
			font-size: 30rpx;
			color: #0C162E;
		}
		.box-top-r-time {
			text {
				font-size: 30rpx;
				font-weight: 500;
				color: #0C162E;
			}
		}
	}
}

.box-item {
	background-color: #FFFFFF;
	box-shadow: 0px 6rpx 20rpx 0px #E8EAEF;
	border-radius: 14rpx;
	.box-item-r {
		.box-item-r-tit {
			font-size: 30rpx;
			color: #0C162E;
		}
		.box-item-r-type {
			width: 60rpx;
			height: 40rpx;
			background: #F1F3F5;
			border-radius: 6rpx;
			font-size: 22rpx;
			font-weight: 500;
			color: #6D788B;
			text-align: center;
			line-height:40rpx ;
		}
		.box-item-r-pay {
			font-size: 24rpx;
			font-weight: 500;
			color: #6D788B;
		}
		.box-item-r-pic {
			font-size: 34rpx;
			color: #FF286A;
		}
	}
}
.paytime,
.pay-status{
	text {
		font-size: 30rpx;
		font-weight: 500;
		color: #0C162E;
	}
}
</style>
